@import (reference) '../common/variables.less';
@import './base-layout.less';

.sidebar-layout {
  display: flex;
  flex-direction: column;

  @media @md-xl {
    flex-direction: row;

    header {
      display: none;
    }

    .header-shadow {
      height: 0;
    }
  }

  .page-title {
    padding: 1rem 0;
  }

  .content-page-title {
    color: @nav-accent;
    font-size: 1rem;

    > .current-page {
      font-size: 3rem;
      margin-top: 10px;
    }

    > .parent-page {
      opacity: 0.6;
    }
  }

  main {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    > .sb-nav-item-container {
      padding-top: 30px;
    }

    > footer {
      margin-top: auto;
    }
  }

  .main-scroll {
    position: absolute;
    z-index: 5;

    bottom: 0;
    top: @header-height-mobile;
    @media @md-xl {
      top: 0;
    }
  }
}
